$(function () {
    // 初始化右上角的登录按钮的显示
    var curUser = JSON.parse($.cookie('User'));
    var curCar = JSON.parse($.cookie('Car'));
    if (curUser == null) {
        $('#nav .user a:eq(0)').text('登录').attr('href', './login.html');
        $('#nav .user a:eq(1)').text('购物车').attr('href', './login.html');
    } else {
        $('#nav .user a:eq(0)').text(curUser.username).attr('href', '#')
        $('#nav .user a:eq(1)').text(`购物车`).attr('href', './car.html')
    }
    init();
    // 初始化页面
    function init() {
        var str = ``;
        var totalChoose = 0;
        var totalPrice = 0;
        $.each(curCar, function (index, item) {
            str = ``;
            // 结算的商品
            if (item.isToPay) {
                // 图片路径
                var src = shoes[(item.id - 1)].src
                // 商品名称
                var shoesName = shoes[(item.id - 1)].name
                // 该商品小计
                var xiaoji = item.price;
                // 数量
                var choose = item.choose;
                // 总个数
                totalChoose += +choose;
                // 总价
                totalPrice += +xiaoji;
                str = `
        <div class="item">
            <img src="${src}" alt="">
            <div>
                <span>${shoesName}</span>
            </div>
            <div>
                <span>$${xiaoji}</span>
            </div>
            <span class="number"> x${choose} </span>
            <span class="bold">有货</span>
        </div>`
                $('.detailed-list .list-right').append(str)
            } else {
                // 结束当前循环
                return;
            }
        })
        // 修改数量显示
        $('.pay .price .number').text(`${totalChoose}`)
        // 修改总价显示
        $('.pay .price .totalPrice').text(`$${totalPrice}`)
        // 修改总价加运费显示
        $('.allTotalPrice').text(`$${totalPrice+5}`);

    }

    // 新增收货地址
    $('#add').on('click', function (e) {
        var reg = /^[1][3,4,5,7,8][0-9]{9}$/;
        var name = $('#theConsignee').val();
        var address = $('#theAddress').val();
        var phone = $('#thePhone').val();
        // 手机号正确
        if (reg.test(phone)) {
            var str = `<div class="address"> <label>${name}</label> <span id="addr">${name} <span class="myAddress">${address} </span>${phone.substring(0, 3)}****${phone.substring(7)}</span> </div>`
            $('.content .remarks').before(str);
            $('#thePhone').css('color', '#000');
            $('#my')[0].close();
            layer.msg('添加成功', { icon: 1, time: 1000 });
        } else {
            $('#thePhone').css('color', 'red');
        }
    })

    // 切换地址
    $('.goods-address').on('click', '.address', function (e) {
        $(this).find('label').addClass('active');
        $(this).siblings().find('label').removeClass('active');
        $('#toAddress').text(`寄送至：${$(e.currentTarget).find('.myAddress').text()}`)
    })


    // 提交订单
    $('.submit').on('click', function () {
        for(var i = 0; i <curCar.length; i++) {
            if(curCar[i].isToPay) {
                curCar.splice(i, 1);
                i--;
            }
        }
        $.cookie('Car', JSON.stringify(curCar));
        layer.msg('下单成功', { icon: 1, time: 1000 },function(){

            location.href = '../car.html';
        });

        
    })
})